<template>

	<view class="main">
		<image class="ysaimg" style="width: 100%;height: 100vh;position: fixed;top: 0;" src="/static/images/ysxq.png"></image>

		<u-navbar :bgColor="bgColor" :fixed="false" title="个人中心" @rightClick="rightClick" :autoBack="true" :leftIconSize="0"></u-navbar>

		<view class="ysjs row_a_c">

			<image v-if="userInfo.avatar" class="tx" :src="userInfo.avatar"></image>
			<image v-else class="tx" src="/static/images/home.png"></image>

			<view class="column">
				<view class="name">{{userInfo.name}}</view>

				<view class="zhiwu ">工号:{{userInfo.number}}</view>
			</view>



		</view>

		<view class="infot">

			<view class="info space-between" style="margin-bottom: 20rpx;">

				<view class="infowz" @click="toUrl('/pages/my/info')">
					<view class="row_a_c">
						<image class="yyjl" src="/static/images/yyjl.png"></image>
						<view class="yyjlwz">我的主页</view>
					</view>

					<view class="row_a_c" style="margin-top: 20rpx;margin-left: 10rpx;">
						<view class="bjzyxx">编辑主页信息</view>
						<view class="bjzyxxb"> > </view>
					</view>
				</view>

				<view class="infowz" @click="toUrl('/pages/my/team')">
					<view class="row_a_c">
						<image class="yyjl" src="/static/images/td.png"></image>
						<view class="yyjlwz">我的团队</view>
					</view>
					<view class="row_a_c" style="margin-top: 20rpx;">
						<view class="row_a_c">
							<view class="bjzyxx no-wrap">成员</view>
							<view class="bjzyxxc no-wrap"> {{total}}人 </view>
						</view>
						<view class="row_a_c" style="margin-left: 20rpx;">
							<view class="bjzyxx no-wrap">已激活</view>
							<view class="bjzyxxc no-wrap"> {{forbidden}}人 </view>
						</view>
					</view>
				</view>

			</view>

			<!-- <view class="infob">
				<view class="row_a_c space-between imte" @click="toUrl('/pages/my/settings')">
					<view class="row_a_c">
						<image class="jgfb" src="/static/images/lxgh.png"></image>
						<view class="jgfbwa">设置</view>
					</view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view> -->

		</view>


	</view>

</template>

<script>
	import auth_api from '@/api/auth.js';
	import team_api from '@/api/team.js';

	export default {

		async onShow() {
			this.access_token = uni.getStorageSync('access_token');
			if (!this.access_token) {
				uni.navigateTo({
					url: '/pages/auth/login'
				});
			} else {
				this.getUserInfoFuc(); //获取登录用户信息
				this.getTeamOverviewFuc(); //获取团队概览
			}
		},

		data() {
			return {
				total: null,
				forbidden: null,
				access_token: null,
				userInfo: null,
				bgColor: 'rgba(0, 31, 63, 0)',
			};
		},
		methods: {

			//获取团队概览
			async getTeamOverviewFuc() {
				const res = await team_api.getTeamOverview();
				if (res.code == 1) {
					this.total = res.data.total;
					this.forbidden = res.data.forbidden;

				} else {
					this.$util.msg(res.message);
					return;
				}
			},

			//获取登录用户信息
			async getUserInfoFuc() {
				const res = await auth_api.getUserInfo();
				if (res.code == 1) {
					this.userInfo = res.data.info;
				} else {
					this.$util.msg(res.message);
					return;
				}
			},
			toUrl(url) {
				this.navTo(url);
			},

		}
	};
</script>

<style scoped lang="scss">
	.ysjs {
		position: absolute;
		top: 250rpx;
		left: 62rpx;

	}

	.name {
		font-weight: 400;
		font-size: 40rpx;
		color: #3D3D3D;
	}




	.tx {
		width: 128rpx;
		height: 128rpx;
		border-radius: 200rpx;
		margin-right: 34rpx;
	}

	.phone {
		font-weight: 400;
		font-size: 40rpx;
		color: #3D3D3D;
		line-height: 56rpx;
		font-style: normal;
		text-transform: none;
	}

	.zhiwu {
		font-weight: 400;
		font-size: 24rpx;
		color: #1FA194;
		line-height: 40rpx;
		margin-top: 10rpx;
	}





	.infot {
		position: absolute;
		top: 440rpx;
		left: 32rpx;
		width: 686rpx;
	}





	.title {
		font-weight: 800;
		font-size: 28rpx;
		color: #3D3D3D;
	}

	.infowz {
		width: 335rpx;
		height: 160rpx;
		background: #FFFFFF;
		border-radius: 12rpx 12rpx 12rpx 12rpx;
		padding: 32rpx;
	}

	.infob {
		min-height: 100rpx;
		background: #FFFFFF;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
		padding: 40rpx 40rpx 10rpx 40rpx;
	}



	.yyjl {
		width: 48rpx;
		height: 48rpx;
	}

	.yyjlwz {
		font-weight: 400;
		font-size: 28rpx;
		color: #3D3D3D;

		margin-left: 16rpx;
	}

	.jgfb {
		width: 48rpx;
		height: 48rpx;

	}

	.jgfbwa {
		font-weight: 400;
		font-size: 28rpx;
		color: #3D3D3D;
		margin-left: 10rpx;
	}

	.imte {
		margin-bottom: 48rpx;
	}

	.bjzyxx {
		font-weight: 400;
		font-size: 20rpx;
		color: rgba(0, 0, 0, 0.4);
		margin-right: 20rpx;
	}

	.bjzyxxb {
		font-weight: 400;
		font-size: 25rpx;
		color: rgba(0, 0, 0, 0.4);
	}

	.bjzyxxc {
		font-weight: 1000;
		font-size: 20rpx;
		color: rgba(0, 0, 0, 0.4);
	}
</style>